<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    <title>jGuery as jQuery plugin -- Javascript in-page Search Engine</title>
    <script language="javascript" type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.1/jquery.min.js"></script>
    <!--<script language="javascript" type="text/javascript" src="http://localhost/jquery.js"></script>-->
    <script type="text/javascript" language="javascript" src="jguery/jguery.nocache.js"></script>
    <script type="text/javascript" language="javascript" src="jquery.search.js"></script>
    <style>
        .matched { color:blue; }
    </style>
  </head>
  <body style="margin:3em">
    <h1>jGuery test</h1>
    <div>developed by <a href="http://twitter.com/xclricky">@xclricky</a>
        see <a href="/">more applications</a>
    </div>
    <br/>
    <br/>
    <form id="form1">
        <input name="q" value="i search" id="query"/>
        <input type="submit" value="Search" id="button1"/>
    </form>
    <br/>
    <div class="index0" style="float:left; width:50%; height:100%">
        <h3>class: index0</h3>
        <p>hello world! I am new to the search industry</p>
        <p>seems I made it work, good test</p>
        <p>I want a further test</p>
        <p>"not sure if I am crazy</p>
    </div>
    <div class="index1" style="">
        <h3>class: index1</h3>
        <p>hello world I am not that new to the search industry</p>
        <p>seems I made it work good test</p>
        <p>I want a further test</p>
        <p>not sure if I am crazy</p>
    </div>
    <script language="javascript">
        jQuery(document).ready(function() {
            $("#query").focus();
            $("#button1").click(function(){
                $(".matched").removeClass("matched");
                $.search($("#query").val(), ".index1 p").addClass("matched");
                return false;
            });
        });
    </script>
  </body>
</html>
